<#include "/WEB-INF/view/inc/inc.html"/>
<@html qmask=0>
<style>
    .media{
        margin-top: 0px;
        border: 1px solid #ddd;
        border-radius: 4px;
        float: left;
    }
    .media-left img{
        width: 50px; height: 50px;
    }
    .media-list{
        width: 106px;
        height: 106px;
        border: 1px solid #ddd;
        border-radius: 4px;
    }

    .borders{
        border: 1px solid #ddd;
        border-radius: 4px;
        float: left;
    }
</style>
<@ueditor init=false parseid='.ueparse'>
var ue2 = qiao.ue('ueditor2', 'mini');
</@ueditor>
<div class="container">
    <div class="row">
        <div class="col-xs-12 col-sm-9 col-md-9 col-lg-9">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" style="margin-bottom: 10px;">
                <h4>
                    <input type="hidden" id="isayid" value="${isayid!}">
                    <@bsinput title='话题' name='title' value=isaytitle! dis=!manage></@bsinput>
                </h4>
            </div>
            <div class="clearfix col-xs-12 col-sm-12 col-md-12 col-lg-12" >
                <#list detaillist! as li>
                <div class="col-xs-3 col-sm-3 col-md-2 col-lg-2">
                    <@faceme></@faceme>
                </div>
                <div class="col-xs-10 col-sm-10 col-md-10 col-lg-10">

                        <div class="well">
                            ${li.y_isaydetail_title!}<br>
                            <@bsul lis=maplistcore['ycore'+li.id]! />
                            <div style="float: right">
                                回复
                                <button onclick="isay(this)">我来回答</button>
                                <button onclick="del('isaydetail',${li.id!})">删除</button>
                                <input type="hidden" id="d_${li.id!}" value="${li.id!}">
                                <textarea rows="3" style="width: 100%"></textarea>
                            </div>
                            ${li.y_isaydetail_content!}
                            <div id="well_${li.id!}"></div>
                         </div>
                </div>
                </#list>
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <div class="borders col-xs-12 col-sm-12 col-md-12 col-lg-12" style="padding-top: 10px;">

                        <input type="hidden" id="isaydetailid" value="${isaydetailid!}">
                        <@bsinput title='我说' name='isaydetailtitle' value=isaydetailtitle!></@bsinput>
                        <label class="control-label col-xs-12 col-sm-2 col-md-2 col-lg-2">观点</label>
                        <label class="col-xs-12 col-sm-10 col-md-10 col-lg-10"><@bsul lis=listmyul /></label>
                        <@bsinput title='评论内容' input=false>
                        <script id="ueditor2" name="row.blog_comment_content" type="text/plain">${isaydetailcontent!}</script>
                        </@bsinput>
                        <p class="text-right">
                            <button type="button" class="btn btn-primary addComment" data-loading-text="保存中。。。" >回复</button>
                        </p>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-xs-12 col-sm-3 col-md-3 col-lg-3">
            <div class="jumbotron" style="padding: 20px;">
                <h2>大家的项目</h2>

                <p style="margin:0;font-size: 15px;">
                    项目就是，长期的一个目标和具体的执行计划。<br>
                    可以关注，删除，查看进度哦<br>
                    记得分享监督。
                </p>
            </div>

            <div class="list-group" style="position:fixed;top:270px;margin-right:20px;" id="myNav">
                <#if blogTypeId??>
                    <a href="${base}/blog/list" class="list-group-item">所有文章</a>
                    <#else>
                        <a href="${base}/blog/list" class="list-group-item active">所有文章</a>
                </#if>
                <a href="#bsmenu" class="list-group-item  active">bsmenu</a>
                <a href="#bslun" class="list-group-item  ">bslun</a>
                <a href="#bsnail" class="list-group-item  active">bsnail</a>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
    $(document).ready(function () {
        $("#myNav").affix({
            offset: {
                top: 125
            }
        });

        var dddddfunc =function (){
            var data = {};
            data["ids"] = $(this).parent().attr("id");
            data["ids1"] = "ddd";
            data["ids2"] = {"dd":1,"ss":"222rr","12":[1,2],"obj":{a:1,b:2,c:3,d:4,f:5,g:6,h:7,i:8,j:9,k:10,l:11}};
            data["ids3"] = [1,2,3];

            ci.debug(data);
        };
        var delfunc =function (){
            var id = $(this).parent().attr("id");
            id = id.replace("id","");
            $.dely(id,"project");
        };
        var listfunc =function (){
            var id = $(this).parent().attr("id");
            id = id.replace("id","");
            qiao.to("${base}/y/c/plan/"+id);
        };

        $(".th-listclass").kq_bind("click",listfunc,{'title':"计划列表"});
        $(".heartclass").kq_bind("click",dddddfunc,{'title':"参与"});
        $(".info-signclass").kq_bind("click",dddddfunc,{'title':"详情"});
        $(".eye-openclass").kq_bind("click",dddddfunc,{'title':"关注"});
        $(".removeclass").kq_bind("click",delfunc,{'title':"删除"});

        $(document).on("change","#id-title",function(i){
            var title = $("#id-title").val();
            var id = $("#isayid").val();
            var data = {};
            data["row.y_isay_title"] = title;
            if(id){
                data["row.id"] = id;
            }else{
                data["row.id"] = "";
                data["row.y_isay_status"] = "5";//初始化，5；发布，10；
            }
            $.savey("isay",data);
        });
        $("input[id^='d_']").each(function(i){
           reloadcomment($(this).val());
        });
        function reloadcomment(id){
            var data ={y_comment_srcid:id,y_comment_srctable:"t_y_isaydetail"};
            ci.ajax("/y/c/getcomment",data,function(result){
                var strwell = "";
                var strwelldiv = "";
                var srcid = "";
                for(var i in result){
                    var ob = result[i];
                    strwell +="<div class='well'>"+ob["y_comment_content"];
                    strwell +='<a onclick="del(\'comment\','+ob['id']+')">删除</a>';
                    strwelldiv += "</div>";
                    if(srcid == ""){
                        srcid = ob["y_comment_srcid"];
                    }
                }
                $("#well_"+srcid).empty().html(strwell+strwelldiv);
            });
        }

        $(document).on("change","textarea",function(i){
            var content = $(this).val();
            var srcid = $(this).prev().val();
            var id = false;
            var data = {};
            data["row.y_comment_content"] = content;
            if(id){
                data["row.id"] = id;
            }else{
                data["row.id"] = "";
                data["row.y_comment_srcid"] = srcid;
                data["row.y_comment_srctable"] = "t_y_isaydetail";
            }
            $.savey("comment",data,true);
            reloadcomment(srcid);
        });
        $(document).on("change","#id-isaydetailtitle",function(i){
            var title = $("#id-isaydetailtitle").val();
            var id = $("#isayid").val();
            var detailid = $("#isaydetailid").val();
            var data = {};
            data["row.y_isaydetail_title"] = title;
            data["row.y_isay_id"] = id;
            if(detailid){
                data["row.id"] = detailid;
            }else{
                data["row.id"] = "";
            }
            $.savey("isaydetail",data,true,function(result){
                $("#isaydetailid").val(result.object.id);
            });
        });
        $(document).on("click",".addComment",function(i){
            var content = ue2.getContent();
            var id = $("#isayid").val();
            var detailid = $("#isaydetailid").val();
            if(detailid){
                var data = {};
                data["row.y_isaydetail_content"] = content;
                if(detailid){
                    data["row.id"] = detailid;
                }else{
                    data["row.id"] = "";
                }
                $.savey("isaydetail",data);
            }else{
                $("#id-isaydetailtitle").focus();
                qiao.bs.msg({msg:"你说了吗？请说",type:"danger"});
            }
        });

        $("#facegroup a").kq_bind("click",function(){
            alert($(this).attr("id"));
        },{'title':"点我"});

        var dblobj = {end:'_end',selecter:'.borders ul>li'}; //标识end: ul li input 的id 后缀，selecter：获取ul方式
        dblobj.func = function(editid,data){//双击后，离开或者回车 ul li input时触发函数
            var editval=$("#"+editid).val();//获取更改内容
            if(editval ==""){
                $("#"+editid).parent().remove();
            }else{
                var id = $("#isaydetailid").val();
                if(id){
                    var liindex = $("#"+editid).parent().index();
                    if(liindex == ($(data.selecter).size()-1)){//如果 input 上级即li 在同级的位置== ul的个数-1 时，即最后一个，增加一空行
                        addNullLi($("#"+editid).parent().parent());
                    }
                    updateUL(ue2,editval,editid,liindex);//更新 富文本框
                    var liid = $("#"+editid).parent().attr("id");
                    $("#"+editid).parent().html(editval); //将点击的td中原内容改为输入的新内容

                    var data = {};
                    data["row.y_core_srctable"] = "t_y_isaydetail";
                    data["row.y_core_srcid"] = id;
                    data["row.y_core_content"] = editval;
                    if(editid && editid>0){
                        data["row.id"] = editid.replace("edit_id","");
                    }else{
                        data["row.id"] = "";
                    }
                    $.savey("core",data,true ,function(result){
                        $("#"+liid).attr("id","id"+result.object.id);
                    });
                }else{
                    $("#id-isaydetailtitle").focus();
                    qiao.bs.msg({msg:"你说了吗？请说",type:"danger"});
                }
            }
        }
        /**
         * 不写成独立方法原因是：对象无法获取 之前获取的方式，是class，id，还是嵌套。
         * 第二，for循环 无法获取一二三四。
         */
        $(document).on("dblclick",".borders ul>li",dblobj,function(i){
            var inval=$(this).html();//获取当前点击li内容
            var inid=$(this).attr("id");//获取当前点击li的id
            $(this).html("<input id='edit_"+inid+ i.data.end+"'name='' value='"+ci.trimhtml(inval)+"'>");//双击以后当前td变成输入框，id定义为edit"+infd+inid+"为了避免重复，value为原内容
            $("#edit_"+inid+i.data.end).keydown(function(event){
                if(event.keyCode==13){
                    i.data.func("edit_"+inid+i.data.end,i.data)
                }
            });
            //鼠标焦点失去后执行
            $("#edit_"+inid+i.data.end).focus().blur(function(){
                i.data.func("edit_"+inid+i.data.end, i.data);
            });
        });



    });

    /**
     * 没有实现 自动排序，因为富文本无法操作，并且无法获取前后的排序，需要便利，
     * 这样好处：用户随意安排，不会删除
     * @param ue
     * @param cont
     * @param id
     * @param liindex
     */
    function updateUL(ue,cont,id,liindex){//更新富文本框
        var percont= ue.getContent();
        var innadd = '<span style="font-size: 18px;"><strong>'+cont+'</strong></span>';
        if($("#ueditor_0").contents().find("#"+id+"_p").length>0){ //如果富文本框中已经有了该id，这更新
            $("#ueditor_0").contents().find("#"+id+"_p").html(innadd);
        }else{//否则 新增
            var add = '<p id="'+id+'_p">'+innadd+'</p><p>...</p>'
            ue.setContent(percont+add);
        }
    }

    function addNullLi(t){
        $(t).append(getMaxLengLi((0-$(t).children().length)));
    }
    function getMaxLengLi(len){
        return '<li class="list-group-item" id="id'+ (len==undefined?0:len) +'">&nbsp;&nbsp;&nbsp;</li>';
    }
    function isay(id){
        $('.borders .list-group').html($(id).parent().prev().html());
        addNullLi($('.borders .list-group'));
    }

    function del(name,id){
        $.dely(id,name);
    };

</script>
<@backtotop/>
</@html>
